<?= $this->Html->script('calendar.asset', array('inline'=>false)) ?>
<?= $this->Html->css('calendar-1.0.0', 'stylesheet', array('inline'=>false)) ?>

<div id="calendar">
    <?= $this->Form->select('location', $locations, array(
        'empty'    => false,
        'onchange' => 'loadStatus()'
    )) ?>
</div>

<script type="text/javascript">
$(function(){
    $('#calendar').calendar({
        monthNames: {
            long:  ['Januar','Februar','Mart','April','Maj','Jun', 'Jul',
                    'Avgust','Septembar','Oktobar','Novembar','Decembar'],
            short: ['Jan','Feb','Mar','Apr','Maj','Jun','Jul',
                    'Avg','Sep','Okt','Nov','Dec']
        },
        dayNames: {
            long:  ['Nedelja', 'Ponedeljak', 'Utorak', 'Sreda', 'Četvrtak', 'Petak', 'Subota'],
            short: ['Ned', 'Pon', 'Uto', 'Sre', 'Čet', 'Pet', 'Sub']
        },
        onShow: loadStatus
    });
})

function loadStatus() {
    var location_id = $('#location').val();
    var days  = [];
    var table = $('#calendar table');
    table.find('tbody td').each(function(){
        days.push($(this).attr('date'));
    });
    
    $.ajax({
        url: '/campaigns/calendar',
        data: {days: days, location: location_id},
        beforeSend: function() {
            table.addClass('loading')
        },
        complete: function(req) {
            table.removeClass('loading')
            var days = eval('('+req.responseText+')');
            
            var campaignIndex = 0;
            var prev = false;
            for (x in days) {
                var td = table.find('tbody td[date='+x+']');
                var lbl = td.find('.date-label');
                
                if (typeof(days[x].Campaign) != 'undefined') {
                    if (! td.hasClass('other-month')) {
                        var Campaign  = days[x].Campaign
                        var Locations = days[x].CampaignsLocation
                        var Client    = days[x].Client
                        
                        var period   = parse_date_period(Locations.start, Locations.end)
                        
                        if (prev != Campaign.id) {
                            campaignIndex++;
                        }
                        
                        prev = Campaign.id
                        
                        td.addClass('occupied campaign_' + campaignIndex);
                        td
                            .attr('title', Client.name + " (" + period + ")")
                            .css({
                                cursor: 'pointer'
                            })
                            .click(function(){
                                location.href = "/campaigns/edit/"+Campaign.id
                            });
                        td.find('.date-label a').removeAttr('title');
                    }
                }else {
                    prev = false;
                    var d = lbl.text();
                    td
                        .removeClass('occupied')
                        .removeAttr('title');
                    
                    if (! td.hasClass('other-month')) {
                        var href = '/campaigns/create/?date=' + td.attr('date') + 
                                                      '&location=' + $('#calendar #location').val()
                        lbl.html('<a title="Kreiraj kampanju..." href="'+href+'">' + d + '</a>');
                    }
                }
            }
        }
    });
}
</script>
